<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>table模块快速使用</title>
    <link rel="stylesheet" href="kit-admin/plugins/layui/css/layui.css" media="all">
</head>

<body>

<div class="layui-btn-group demoTable">
    <button class="layui-btn" data-type="query">查询用户</button>
    <button class="layui-btn" data-type="add">新增用户</button>
    <button class="layui-btn" data-type="edit">编辑用户</button>
    <button class="layui-btn" data-type="move">设备移交</button>
    <button class="layui-btn" data-type="destroy">设备报废</button>
    <button class="layui-btn" data-type="reUse">恢复正常使用</button>
</div>
<table class="layui-table" lay-data="{height:315, url:'kHDeviceController.do?dataGrid', page:true, height: 'full-60'}"
       lay-filter="kHDevice" id="kHDevice">
    <thead>
    <tr>
        <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
    <#--<th lay-data="{field:'id', width:200, sort: true}">id</th>-->
        <th lay-data="{fixed: 'left', width:200, sort: true,toolbar: '#barDemo'}">操作</th>
    <#--<th lay-data="{field:'deviceName', width:200, sort: true}">设备名称</th>-->
        <th lay-data="{field:'deviceType', width:200, sort: true,templet: '#deviceType'}">设备类别</th>
        <th lay-data="{field:'factoryArea', width:200, sort: true,templet: '#factoryArea'}">厂区</th>
        <th lay-data="{field:'useUser', width:200, sort: true}">使用人</th>
        <th lay-data="{field:'departmentName', width:200, sort: true}">部门</th>
        <th lay-data="{field:'deviceKind', width:200, sort: true}">设备编码</th>
        <th lay-data="{field:'firstUseTime', width:200, sort: true}">领用日期</th>
        <th lay-data="{field:'applyUser', width:200, sort: true}">申请人</th>
        <th lay-data="{field:'remark', width:200, sort: true}">备注</th>
        <th lay-data="{field:'status', width:200, sort: true,templet: '#status'}">设备状态</th>
        <th lay-data="{field:'compulaterIp', width:200, sort: true}">设备ip</th>
    </tr>
    </thead>
</table>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="moveLog">查看移交记录</a>
</script>

<script type="text/html" id="deviceType">
    {{#  if(d.deviceType == 1) { }}
    <span class="layui-badge layui-bg-green">{{  '硬件设备' }}</span>
    <#--<span class="layui-badge layui-bg-blue">人未到</span>-->
    {{#  } else if(d.deviceType == 2) { }}
    <span class="layui-badge">电脑设备</span>
    {{#  } else if(d.deviceType == 3) { }}
    <span class="layui-badge layui-bg-green">信息系统</span>
    {{#  } else { }}
    <span style="color: red;">未知状态</span>
    {{#  } }}
</script>
<script type="text/html" id="factoryArea">
    {{#  if(d.factoryArea == 1) { }}
    <span class="layui-badge layui-bg-green">{{  '中关村' }}</span>
    <#--<span class="layui-badge layui-bg-blue">人未到</span>-->
    {{#  } else if(d.factoryArea == 2) { }}
    <span class="layui-badge">余桥</span>
    {{#  } else if(d.factoryArea == 3) { }}
    <span class="layui-badge layui-bg-green">南厂区</span>
    {{#  } else { }}
    <span style="color: red;">未知状态</span>
    {{#  } }}
</script>
<script type="text/html" id="status">
    {{#  if(d.status == 1) { }}
    <span class="layui-badge layui-bg-green">{{  '正常' }}</span>
    <#--<span class="layui-badge layui-bg-blue">人未到</span>-->
    {{#  } else if(d.status == 2) { }}
    <span class="layui-badge">报废</span>
    {{#  } else if(d.factoryArea == 3) { }}
    <span class="layui-badge layui-bg-green">南厂区</span>
    {{#  } else { }}
    <span style="color: red;">未知状态</span>
    {{#  } }}
</script>

<#include "/common/array2json.ftl"/>

<script src="kit-admin/plugins/layui/layui.js"></script>

<script>
    layui.use('table', function () {
        var table = layui.table;
        var paramCache = {};

        var $ = layui.$, active = {
            query: function () { //添加数据
                /* var checkStatus = table.checkStatus('idTest')
                ,data = checkStatus.data;
                layer.alert(JSON.stringify(data)); */
                var ml = layer.open({
                    type: 2,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '重置', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: 'kHDeviceController.do?goKHDeviceQuery' + param2url(paramCache),
                    yes: function (index, lay) {
                        var body = layer.getChildFrame('body', index);
                        var formArr = body.find("form").serializeArray();
                        var param = arr2json(formArr);
                        paramCache = param;
//                        layer.msg("添加成功");
                        table.reload('kHDevice', {
                            page: {
                                curr: 1 //重新从第 1 页开始
                            },
                            where: param,
                        });
                        layer.close(index);
                    },
                    btn2: function (index, layero) {
                        for (key in paramCache) {
                            paramCache[key] = "";
                        }
                        table.reload('kHDevice', {
                            page: {
                                curr: 1 //重新从第 1 页开始
                            },
                            where: paramCache,
                        });
                    },
                });
                layer.full(ml);
            },
            add: function () { //添加数据
                /* var checkStatus = table.checkStatus('idTest')
                ,data = checkStatus.data;
                layer.alert(JSON.stringify(data)); */
                var ml = layer.open({
                    type: 2,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: 'kHDeviceController.do?goKHDeviceAdd',
                    yes: function (index, lay) {
                        var body = layer.getChildFrame('body', index);
                        var formArr = body.find("form").serializeArray();
                        var param = arr2json(formArr);
                        post("kHDeviceController.do?doKHDeviceAdd", param, data => {
                            layer.msg("添加成功");
                        table.reload('kHDevice', {
                            page: {
                                curr: 1 //重新从第 1 页开始
                            },
                        });
                    })
                        ;
                        layer.close(index);

                    }
                });
                layer.full(ml);
            },
            destroy() {
                var checkStatus = table.checkStatus('kHDevice')
                        , data = checkStatus.data;
                if (1 != data.length) {
                    layer.msg("请选择一行数据");
                    return;
                }
                data = data[0];
                layer.open({
                    type: 1,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: '确定报废？',
                    yes: function (index, lay) {

                        post("kHDeviceController.do?doKHDeviceUpdate", {id:data.id,status:2}, data => {
                            layer.msg("报废成功");
                            $("button.layui-laypage-btn").click();
                        });
                        layer.close(index);
                    }
                });
            },
            reUse() {
                var checkStatus = table.checkStatus('kHDevice')
                        , data = checkStatus.data;
                if (1 != data.length) {
                    layer.msg("请选择一行数据");
                    return;
                }
                data = data[0];
                layer.open({
                    type: 1,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: '确定恢复？',
                    yes: function (index, lay) {

                        post("kHDeviceController.do?doKHDeviceUpdate", {id:data.id,status:1}, data => {
                            layer.msg("报废成功");
                            $("button.layui-laypage-btn").click();
                        });
                        layer.close(index);
                    }
                });
            },
            move: function () {
                var checkStatus = table.checkStatus('kHDevice')
                        , data = checkStatus.data;
                if (1 != data.length) {
                    layer.msg("请选择一行数据");
                    return;
                }
                data = data[0];
                var ml = layer.open({
                    type: 2,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: 'deviceUseLogController.do?goDeviceUseLogAdd&id=' + data.id,
                    yes: function (index, lay) {
                        var body = layer.getChildFrame('body', index);
                        var formArr = body.find("form").serializeArray();
                        var param = arr2json(formArr);
                        post("deviceUseLogController.do?doDeviceUseLogAdd", param, data => {
                            layer.msg("更新成功");
                        $("button.layui-laypage-btn").click();
                    })
                        ;
                        layer.close(index);
                    }
                });
            },
            edit: function () {
                var checkStatus = table.checkStatus('kHDevice')
                        , data = checkStatus.data;
                if (1 != data.length) {
                    layer.msg("请选择一行数据");
                    return;
                }
                data = data[0];
                var ml = layer.open({
                    type: 2,
                    title: false,
                    area: ['630px', '360px'],
                    btn: ['确定', '取消'], //只是为了演示
                    shade: 0.8,
                    closeBtn: 1,
                    shadeClose: true,
                    content: 'kHDeviceController.do?goKHDeviceUpdate&id=' + data.id,
                    yes: function (index, lay) {
                        var body = layer.getChildFrame('body', index);
                        var formArr = body.find("form").serializeArray();
                        var param = arr2json(formArr);
                        post("kHDeviceController.do?doKHDeviceUpdate", param, data => {
                            layer.msg("更新成功");
                            $("button.layui-laypage-btn").click();
                        });
                        layer.close(index);
                    }
                });
                layer.full(ml);
            }
        };
        table.on('tool(kHDevice)', function (obj) {
            var data = obj.data
            if ('moveLog' == obj.event) {
                postTable("deviceUseLogController.do?dataGrid", {deviceId: data.id}, res => {
                    console.info(res);
                    var process='';
                    for(var i=0; i<res.data.length;i++){
                        var item=res.data[i];
                        process+=item.orgUser+"->"+item.acceptUser+"<br/>";
                    }
                    layer.alert(process);
                });
            }

        });

    <#include "/common/post.js"/>

        $('.demoTable .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>
</body>

</html>